<template>
  <div class="home-body">
    <div class="home_header">
      <h3>仿网易严选电商管理系统</h3>
      <i class="el-icon-menu home-icon"></i>
      <el-dropdown trigger="click" class="home-dropdown">
        <span class="el-dropdown-link">
          下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu slot="dropdown" class="dropdown-in">
          <el-dropdown-item>首页</el-dropdown-item>
          <el-dropdown-item>退出</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>
    <div class="home_menu">菜单</div>
    <div class="home_content">右侧</div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="less">
.home-body {
  position: relative;
  height: 100%;
  .home_header {
    height: 70px;
    background-color: #409eff;
    line-height: 70px;
    h3 {
      display: inline-block;
      color: #fff;
      font-weight: bold;
      font-size: 24px;
      padding: 0 20px;
    }
    .home-icon {
      color: #fff;
      font-size: 24px;
    }
    .home-dropdown {
      color: #fff;
      float: right;
      margin-right: 20px;
      line-height: 70px;
      .dropdown-in{
          top:42px !important;
      }
    }
    
  }
  .home_menu {
    position: absolute;
    width: 250px;
    top: 70px;
    left: 0;
    bottom: 0;
  }
  .home_content {
    position: absolute;
    right: 0;
    top: 70px;
    left: 250px;
    bottom: 0;
  }
}
</style>
